<template>
	<view>
		<navbar name="记录睡眠"></navbar>
		<!-- 睡眠控件 -->
		<!-- 	<view class="selection">
			<view class="item-content"
			  @tap="handleTap('picker8')">
			  <text class="item-title">绑定值:{{ value8 }}</text>
			  <view class="item-value">
			    <text class="item-placeholder">点我打开选择器</text>
			  </view>
			</view>

			<view class="item-content"
			  @tap="handleTap('picker9')">
			  <text class="item-title">绑定值:{{ value9 }}</text>
			  <view class="item-value">
			    <text class="item-placeholder">点我打开选择器</text>
			  </view>
			</view>

		</view> -->
		<!-- end -->
		<view class="weui-flex">
			<view>
				<view class="placeholder titleView">
					睡觉时间
				</view>
			</view>
			<view class="weui-flex__item">
				<view class="placeholder toolView" :class="label8=='请选择睡觉时间'?'':'colorA4'"
					@click="handleTap('picker8')">
					<!-- {{value8==''?label:value8}} -->
					{{label8}}
				</view>
			</view>
		</view>
		<view class="weui-flex">
			<view>
				<view class="placeholder titleView">
					起床时间
				</view>
			</view>
			<view class="weui-flex__item">
				<view class="placeholder toolView" :class="label9=='请选择起床时间'?'':'colorA4'"
					@click="handleTap('picker9')">
					<!-- {{value9==''?label:value9}} -->
					{{label9}}
				</view>
			</view>
		</view>
		<lb-picker ref="picker8" v-model="value8" mode="dateSelector" :format="curFormat"
			display-format="YYYY-MM-DD-HH-mm" @change="handleChange" @confirm="handleConfirm" @cancel="handleCancel"
			:start-date="startDate1" :end-date="endTime">
		</lb-picker>

		<lb-picker ref="picker9" v-model="value9" mode="dateSelector" :format="curFormat"
			display-format="YYYY-MM-DD-HH-mm" @change="handleChange" @confirm="handleConfirm2" @cancel="handleCancel"
			:start-date="thisDate" :end-date="endTime2">
		</lb-picker>
		<!-- <lb-picker ref="picker1" v-model="value1" mode="dateSelector" @change="handleChange" @confirm="handleConfirm"
			@cancel="handleCancel" start-date="2020-12-31" >
		</lb-picker> -->
		<button class="relevance-btn" :class="stimestamp==''||etimestamp==''?'disabledbg':''" :disabled="disabled||stimestamp==''||etimestamp==''"
			@tap.stop="formtime" type="default">保存</button>
	</view>
</template>

<script>
	import dayjs from '@/common/utils/day/day.js'
	import lbPicker  from '@/pages/subpackage/components/lb-picker/index';
	export default {
		components: {
			lbPicker
		},
		data() {
			return {
				disabled: false, //是否禁用
				stimestamp: '', //开始时间
				etimestamp: '', //结束时间
				name: '',
				startDate1: this.$basejs.getBeforeDateS(1),
				thisDate: this.$basejs.thisdayFormat2(false),
				endTime: this.$basejs.thisdayFormat2(false),
				endTime2: dayjs().format('YYYY-MM-DD HH:mm:ss'),
				curFormat: 'YYYY-MM-DD HH:mm',
				displayFormat: {
					// 'YYYY': 'YYYY',
					// 'YYYY-MM': 'YYYY-MM',
					// 'YYYY-MM-DD': 'YYYY-MM-DD',
					// 'MM-DD': 'MM-DD',
					// 'DD日HH时mm分': 'DD-HH-mm',
					'HH:mm:ss': 'YYYY-MM-DD-HH-mm',
					// 'mm:ss': 'mm-ss',
					// 'mm分ss秒': 'mm-ss'
				},
				value9: '',
				value8: '',
				indicId: '', //指标id
				value1: '',
				label8: '请选择睡觉时间',
				label9: '请选择起床时间',
			}
		},
		onLoad(e) {
			this.indicId = e.indicId ? e.indicId : 6;
			let value8 = this.$basejs.thisdayFormat2(false, 1) + ' 23:00',
				value9 = this.$basejs.thisdayFormat2(false) + ' 07:00';
			this.value8 = value8;
			this.value9 = value9;
			// value8 = value8.replace(/-/, '/')
			// value9 = value9.replace(/-/, '/')
			// console.log(value8, value9, '---111111111111111')
			// this.stimestamp = Math.round(new Date(value8) / 1000);
			// this.etimestamp = Math.round(new Date(value9) / 1000);
			// console.log(Math.round(new Date(value8) / 1000), Math.round(new Date(value9) / 1000), '1055555555555555')
		},
		methods: {
			formtime() {
				// console.log(this.stimestamp, this.etimestamp)
				let formatMsgTime = this.$basejs.formatMsgTime(this.stimestamp, this.etimestamp);
				if (formatMsgTime < 1) {
					uni.showToast({
						title: '结束时间需要晚于开始时间',
						icon: "none",
						duration: 2000
					});
				} else {
					this.addRecord(formatMsgTime)
				}
			},
			// 记录
			addRecord(sleepTimeLen) {
				// let _this = this,
				// 	fdata = {
				// 		sleepTimeLen:sleepTimeLen,
				// 		indicId: this.indicId,
				// 		recordTime: _this.$basejs.getToday().join('-'),
				// 		userId: uni.getStorageSync(global.IS_DEV?'USER_DATA_BSY_T':'USER_DATA_BSY_Z').userId
				// 	};
				this.disabled = true
				let _this = this,
					fdata = {
						deviceType: 'SLEEP',
						recordTime: _this.$basejs.getToday().join('-'),
						inputType: 1, //1手动 2设备
						userId: uni.getStorageSync(global.IS_DEV?'USER_DATA_BSY_T':'USER_DATA_BSY_Z').userId,
						mac: '', //设备mac
						deviceId: '', //设备id
						healthDataId: '',
						healthData: JSON.stringify({
							sleepTimeLen: sleepTimeLen
						}),
					};
				// console.log(fdata)
				// return
				this.$api.post(global.apiUrls.addRecord, fdata).then(res => {
					if (res.data.code == 1000) {
						_this.stimestamp=''
						_this.etimestamp=''
						uni.showToast({
							title: res.data.message,
							duration: 2000
						});
						setTimeout(() => {
							uni.navigateBack({
								delta: 1
							});
						}, 2000);
					} else {
						uni.showToast({
							title: res.data.message,
							icon: "none",
							duration: 2000
						});
					}
					_this.disabled = false;
				}).catch(err => {
					_this.disabled = false;
				})
			},
			handleTap(name) {
				// this.name = name;
				this.$refs[name].show()
			},
			handleChange(e) {},
			handleConfirm(e) {
				e.item.month = e.item.month <= 9 ? '0' + e.item.month : e.item.month; //月
				e.item.day = e.item.day <= 9 ? '0' + e.item.day : e.item.day; //日
				e.item.hour = e.item.hour <= 9 ? '0' + e.item.hour : e.item.hour; //时
				e.item.minute = e.item.minute <= 9 ? '0' + e.item.minute : e.item.minute; //分
				console.log(e.item.year + '.' + e.item.month + '.' + e.item.day + ' ' + e.item.hour + ':' + e.item
					.minute, '1755555555555555555')

				let time = e.item.year + '/' + e.item.month + '/' + e.item.day + ' ' + e.item.hour + ':' + e.item.minute +
					':' + e.item.second,
					time2 = e.item.year + '-' + e.item.month + '-' + e.item.day + ' ' + e.item.hour + ':' + e.item.minute;
				this.label8 = time2
				time = Math.round(new Date(time) / 1000)
				this.stimestamp = time;
			},
			handleConfirm2(e) {
				e.item.month = e.item.month <= 9 ? '0' + e.item.month : e.item.month; //月
				e.item.day = e.item.day <= 9 ? '0' + e.item.day : e.item.day; //日
				e.item.hour = e.item.hour <= 9 ? '0' + e.item.hour : e.item.hour; //时
				e.item.minute = e.item.minute <= 9 ? '0' + e.item.minute : e.item.minute; //分
				let time = e.item.year + '/' + e.item.month + '/' + e.item.day + ' ' + e.item.hour + ':' + e.item.minute +
					':' + e.item.second,
					time2 = e.item.year + '-' + e.item.month + '-' + e.item.day + ' ' + e.item.hour + ':' + e.item.minute;
				this.label9 = time2
				time = Math.round(new Date(time) / 1000)
				this.etimestamp = time;
			},
			handleCancel(e) {
				console.log('cancel::', e)
			},
		}
	}
</script>

<style lang="scss">
	@import "./record.scss";

	.selection {
		width: 552upx;
		height: 553upx;
		background: #fff;
		margin: 62upx auto 68upx;
	}

	.btnActave {
		background: linear-gradient(112deg, #81C042 0%, #2EA7E0 100%);
	}
</style>
